<template>
  <div class="gobang-wrap">
    <Board v-if="showBoard" @go-back="showBoard = false" />
    <Users v-else @go-playing="goPlaying" />
  </div>
</template>

<script lang="ts" setup>
import { ref, reactive } from "vue"
import Board from "./Board.vue"
import Users from "./Users.vue"
let showBoard = ref(false)
let userInfo = reactive({})

function goPlaying(data) {
  showBoard.value = true
  console.log(data)
}
</script>

<style scoped lang="scss">
.gobang-wrap {
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>
